<script setup lang="ts">
import { ref, watch, defineEmits } from 'vue';
import TopInput from './components/top-input.vue';
import TopTable from './components/top-table.vue';

const tableData = ref({});
const detailData = ref({});
</script>

<template>
  <div class="flow-query">
    <a-card>
      <template #title>
        <div class="card-title">配送计划</div>
      </template>
      <div class="content">
        <TopInput
          @updateArray="tableData = $event"
          @updateDetailArray="detailData = $event"
        />
        <a-divider />
        <TopTable :table-data="tableData" :detail-data="detailData" />
      </div>
    </a-card>
  </div>
</template>

<style scoped>
.flow-query {
  margin: 0px;
  padding: 10px;
  height: 100%;
}
.card-title {
  font-size: 24px;
}
.content {
  display: flex;
  flex-direction: column;
}
</style>
